<template>
	<view class="content">
		<view class="header">
			<u-tabs :list="list1" @change="tabsChange"></u-tabs>
			<u-search v-model="requestParams.workOrderId" placeholder="请输入工单号进行搜索" :clearabled="true"
				:showAction="false"></u-search>
		</view>
		<view class="main">
			<view class="main_body" v-for="(item, index) in dataForm" :key="index">
				<view class="detail">
					<view class="main_body_view main_body_view_title">
						<u-row>
							<u-col span="10">{{item.workOrderId}}</u-col>
							<u-col span="2">{{buttonStatus(item.workOrderStatusId)}}</u-col>
						</u-row>
					</view>
					<view class="main_body_view">
						<u-row>
							<u-col span="6">联系人：{{item.contact||''}}</u-col>
							<u-col span="6">时间：{{item.preStartTime|formatDate('MM-dd HH:mm')}}</u-col>
							</u-row>
					</view>
					<view class="main_body_view">
						<u-row>
						<u-col span="6">指派人：{{item.dispUserName||''}}</u-col>
						<u-col span="6">被派人：{{item.supUserName||''}}</u-col>
						</u-row>
					</view>
					<view class="main_body_view">内容：{{item.workOrderContent}}</view>
					<view class="main_body_view">地址：{{item.address||''}}</view>
					<text class="main_body_view">备注：{{item.remark||''}}</text>
				</view>
				<view class="button" style="margin-bottom: 10px;">
					<u-button @click="buttonClick(item)" type="primary" size="mini"
						:text="buttonText(item.workOrderStatusId)"></u-button>
				</view>
				<view style="height:20px ;" />
			</view>

		</view>
	</view>

</template>

<script>
	import request from "@/utils/request.js"
	export default {
		data() {
			return {
				dataForm: [],
				requestParams: {
					workOrderId: '', //工单id
					// dispUserId:4,
					supUserId: this.$store.state.user.userId, //工程师id
					pageNum: 1,
					pageSize: 10,
					workOrderStatusIds: '1,13', //工单状态
					workOrderStatusId: ''
				},
				notStatus: '1,13',
				yesStatus: '100',
				title: 'Hello',
				list1: [{
					name: '未完成',
				}, {
					name: '已完成',
				}],
				// buttonText:'按钮'
			}
		},
		onLoad: async function() {
			uni.showLoading({
				title: '正在加载中'
			})
			// await this.getInfo();
			await this.getFormData();
			uni.hideLoading()
		},
		onReachBottom() {
			this.requestParams.pageNum = this.requestParams.pageNum - 0 + 1;
			this.getFormData()
		},
		watch: {
			'requestParams.workOrderId'(newVal, oldVal) {
				this.changeSelect(newVal);
			}
		},
		filters: {
			formatDate: function(value, args) {
				var dt = new Date(value);
				if (args == 'yyyy-M-d') { // yyyy-M-d
					let year = dt.getFullYear();
					let month = dt.getMonth() + 1;
					let date = dt.getDate();
					return `${year}-${month}-${date}`;
				} else if (args == 'yyyy-M-d H:m:s') { // yyyy-M-d H:m:s
					let year = dt.getFullYear();
					let month = dt.getMonth() + 1;
					let date = dt.getDate();
					let hour = dt.getHours();
					let minute = dt.getMinutes();
					let second = dt.getSeconds();
					return `${year}-${month}-${date} ${hour}:${minute}:${second}`;
				} else if (args == 'yyyy-MM-dd') { // yyyy-MM-dd
					let year = dt.getFullYear();
					let month = (dt.getMonth() + 1).toString().padStart(2, '0');
					let date = dt.getDate().toString().padStart(2, '0');
					return `${year}-${month}-${date}`;
				} else { // yyyy-MM-dd HH:mm:ss
					let year = dt.getFullYear();
					let month = (dt.getMonth() + 1).toString().padStart(2, '0');
					let date = dt.getDate().toString().padStart(2, '0');
					let hour = dt.getHours().toString().padStart(2, '0');
					let minute = dt.getMinutes().toString().padStart(2, '0');
					let second = dt.getSeconds().toString().padStart(2, '0');
					return `${month}-${date} ${hour}:${minute}`;
				}
			}
		},
		methods: {
			buttonStatus(statusId) {
				let text = "";
				switch (statusId) {
					case "1":
						text = "未接单";
						break;
					default:
						text = '已接单';
						break;
				}
				return text;
			},
			buttonText(statusId) {
				let text = "";
				switch (statusId) {
					case "1":
						text = "接单";
						break;
					case "13":
						text = "详情";
						break;
					default:
						text = "详情";
						break;
				}
				return text;
			},
			// 点击按钮
			buttonClick(item) {
				uni.showLoading({
					title: '正在加载中'
				})
				
				let requestData = item;
				console.log('requestDate', requestData);
				if (item.workOrderStatusId == '1') {
					requestData.method = "temp_pick_order";
				} 
				// else if (item.workOrderStatusId == '13') {
				// 	requestData.method = "all_end";
				// } 
				else {
					
					uni.navigateTo({
					 	url: "detail?workId=" + requestData.workOrderId
					 })
					return;
				}
				
				request({
					url: 'system/orderTemp',
					method: "PUT",
					data: requestData
				}).then((res) => {
					this.dataForm.length = 0;
					this.getFormData();
					uni.hideLoading()
				})
			},
			// 完成未完成
			tabsChange(item) {
				uni.showLoading({
					title: "正在加载中"
				})
				console.log('索引值：', item);
				if (item.index === 0) {
					// console.log('workOrderStatusIds', this.requestParams.workOrderStatusId);
					this.requestParams.workOrderStatusIds= this.notStatus;
					this.requestParams.workOrderStatusId = '';
					// console.log('workOrderStatusIds', this.requestParams.workOrderStatusId);
				} else {
					// console.log('workOrderStatusIds', this.requestParams.workOrderStatusId);
					this.requestParams.workOrderStatusId = this.yesStatus;
					this.requestParams.workOrderStatusIds= '';
					// console.log('workOrderStatusIds', this.requestParams.workOrderStatusId);
				}
				this.requestParams.pageNum = 1;
				this.dataForm.length = 0;
				this.getFormData();
				uni.hideLoading()
			},
			
			// 查询列表数据
			getFormData() {
				request({
					url: 'system/orderTemp/list',
					method: "GET",
					data: this.requestParams
				}).then((res) => {
					this.requestParams.pageNum -= (!res.rows);
					if (this.dataForm.length < res.total) {
						this.dataForm = this.dataForm.concat(res.rows);
					}
				})
			},
			// 搜索功能
			changeSelect(item) {
				uni.showLoading({
					title: "正在加载中"
				})
				console.log('搜索功能:', item);
				this.requestParams.workOrderId = item + '';
				this.requestParams.pageNum = 1;
				this.dataForm.length = 0;
				this.getFormData();
				uni.hideLoading()
			}
		}
	}
</script>

<style lang="scss" scoped>
	.header {
		box-sizing: border-box;
		width: 100%;
		position: sticky;
		top: 0;
		z-index: 999;
		display: flex;
		overflow: hidden;
		justify-content: space-around;
		background-color: #dcdcdc;
		margin-bottom: 10upx;
		// .u-search{
		// 	width: 50px;
		// }
	}

	.main {
		margin-bottom: 100px;

		.main_body {
			background-color: #d2dad3;
			margin: 20upx;
			border-radius: 2%;
			box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
			padding: 20upx;

			.main_body_view {
				margin: 10upx;
			}

			.main_body_view_title {
				border-bottom: 1px solid black;
				margin-bottom: 10upx;
			}

			.button {
				position: absolute;
				// bottom: 30upx;
				right: 100upx;
				width: 40rpx;
			}
		}
	}


	.tabbar {
		position: sticky;
		bottom: 30upx;
		z-index: 999;
	}
</style>